class Register {
    constructor() {
        //  获取元素 
        this.username = document.querySelector('#recipient-username')
        console.log(this.username)

        this.phone = document.querySelector('#recipient-phone')
        this.password = document.querySelector('#recipient-password')
        this.checkpassword = document.querySelector('#recipient-checkpassword')
        this.btn = document.querySelector('.btn')
        console.log(this.btn)
        this.tips1 = document.querySelector('.tips1')
        this.tips2 = document.querySelector('.tips2')
        // 初始化布尔值，会根据下面some返回的布尔值改变而改变，和下面没有关系
        this.showname = false
        this.showphone = false
        this.checkUsername()
        this.checkPhone()
        this.handleRegister()
    }
    //  注册
    handleRegister() {
        this.btn.onclick = () => {
            if (!this.username.value || !this.phone.value || !this.password.value || !this.checkpassword.value) {
                alert('请填写所有注册信息')
                return
            }
            if (this.password.value != this.checkpassword.value) {
                alert('两次密码不一致，请重新输入')
                return
            }

            var obj = {
                username: this.username.value,
                phone: this.phone.value,
                password: this.password.value,
                checkpassword: this.checkpassword.value
            }

            console.log(this.showname, this.showphone)
            // 根据下面some返回的布尔值两个都是false的时候才能注册成功

            if (!this.showname && !this.showphone) {
                let arr = this.getRegisterInfo()
                arr.push(obj)
                localStorage.setItem('info', JSON.stringify(arr))
                this.username.value = ''
                this.phone.value = ''
                this.password.value = ''
                this.checkpassword.value = ''
                alert('注册成功！即将跳转到登陆页面!')
                setTimeout(()=>{
                    location.href = 'login.html'
                },2000)
            } else {
                alert('注册信息有误！')
                return
            }


        }
        // console.log(1)
    }
    // 获取注册表信息
     //  如果没有获取到返回空数组，如果没有数据，上面调用得到的就是一个空数组
    
    getRegisterInfo() {
        return JSON.parse(localStorage.getItem('info')) || []
    }
    //  验证用户名是否重复
    checkUsername() {
        this.username.onblur = () => {
            let arr = this.getRegisterInfo()
            if (arr.length > 0) {
                var res = arr.some((res) => { return res.username == this.username.value })
                // 根据some返回的布尔值给showname赋值判断
                this.showname = res
                if (res) {
                    this.tips1.innerHTML = '该用户名已经被注册'
                    console.log(this.tips1.innerHTML)
                } else {
                    this.tips1.innerHTML = ''
                }
            }
        }
    }
    // 验证手机号
    checkPhone() {
        this.phone.onblur = () => {
            //  获取注册信息表
            let arr = this.getRegisterInfo()
            if (arr.length > 0) {
                var res = arr.some((res) => { return res.phone == this.phone.value })
                this.showphone = res
                if (res) {
                    this.tips2.innerHTML = '该手机号已经被注册'
                    console.log(this.tips2.innerHTML)
                } else {
                    this.tips2.innerHTML = ''
                }
            }
        }
    }
}

new Register()


